<template>
  <li @click="$emit('update:todo', todo.text)">
    <span><img src="../assets/image/ic_history_dark.png" alt="" /></span
    ><span>{{ todo.text }}</span>
  </li>
</template>

<script>
export default {
  props: ["todo"],
};
</script>

<style lang="less" scoped>
li {
  display: flex;
  align-items: center;
  padding: 5px 0;
  span {
    display: block;
    padding: 5px 5px;
    &:nth-child(1) {
      width: 10%;
      text-align: center;
      img {
        width: 80%;
      }
    }
    &:nth-child(2) {
      flex: 1;
      border-bottom: 1px solid gray;
    }
  }
}
</style>